<template>
  <view>
    <view class="bg-img"></view>
    <!-- logo 居中 -->
    <view class="st-home">
      <img src="/static/logo.png" alt="" srcset="" />
      <text class="st-sj">混沌数据</text>
      <text>艺术&商业IP一体化服务商</text>
      <navigator class="st-login" url="/pages/y_home/y_home">登录</navigator>
      <view class="st-res" @click="register" url="#">注册</view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {};
  },
  methods: {
    // 注册被点击 弹出信息框
    register() {
      uni.showModal({
        title: "提示",
        content: "内测版本直接登录即可使用",
        showCancel: false,
        confirmText: "确定",
        success: function (res) {
          if (res.confirm) {
            console.log("用户点击确定");
          }
        },
      });
    },
  },
};
</script>

<style lang="scss">
.bg-img {
  width: 100vw;
  height: 50vh;
  background-color: red;
  position: absolute;
  z-index: -1;
  background: linear-gradient(176deg, red 0%, #ffffff 90%);
}

.st-home {
  width: 100vw;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  img {
    width: 38px;
    height: 38px;
  }

  text {
    font-size: 16px;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #bdbec5;
    line-height: 24px;
  }

  .st-sj {
    margin-top: 50px;
  }

  navigator,
  .st-res {
    width: 80%;
    height: 60px;
    box-sizing: border-box;
    border-radius: 30px;
    align-items: center;
    text-align: center;
    justify-content: center;
    display: flex;
  }

  .st-login {
    margin-top: 30px;
    background-color: #1c2238;
    color: #fff;
  }

  .st-res {
    background-color: #fff;
    border: #1c2238 1px solid;
    margin-top: 20px;
  }
}
</style>
